import React, { useEffect, useState } from 'react'
import EChartsReact from 'echarts-for-react'
function LineTwoComponent() {
    const [option, setOption] = useState({});
  useEffect(() => {
    setOption({
      title: {
        text: "开票数据",
      },
      tooltip: {
        trigger: "axis",
        axisPointer: {
          type: "cross",
          label: {
            backgroundColor: "#6a7985",
          },
        },
      },
      legend: {
      },
      toolbox: {
        feature: {
          saveAsImage: {},
        },
      },
      grid: {
        left: "3%",
        right: "4%",
        bottom: "3%",
        containLabel: true,
      },
      xAxis: [
        {
          type: "category",
          boundaryGap: false,
          data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月','8月','9月','10月','11月','12月'],
        },
      ],
      yAxis: [
        {
          type: "value",
          name: '万', // Y轴顶部添加单位
          nameLocation: 'end', // 位置设置为Y轴顶部
        },
      ],
      series: [
        {
          name: "天津",
          type: "line",
          stack: "Total",
          areaStyle: {},
          emphasis: {
            focus: "series",
          },
          data: [120, 132, 101, 134, 90, 230, 210,455,556,863,879,695],
        },
        {
          name: "北京",
          type: "line",
          stack: "Total",
          areaStyle: {},
          emphasis: {
            focus: "series",
          },
          data: [220, 182, 191, 234, 290, 330, 310,569,586,896,787,695],
        },
      ],
    });
  }, []);
  return (
    <EChartsReact style={{ width: "100%", height: "355px", margin: "5px 0" }} option={option}/>
  )
}

export default LineTwoComponent
